<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!--登录页面-->
<!--导航栏要有首页、登录、注册链接-->
<!DOCTYPE html>
<html lang="en">
<head>

    <meta charset="UTF-8">
    <title>Shoppe官网登录</title>
    <!--	用base标签永远固定相对路径跳转时的效果-->
    <%String basePath= request.getScheme()
            +"://"
            +request.getServerName()
            +":"
            +request.getServerPort()
            +request.getContextPath()
            +"/";
    %>
    <base href="<%=basePath%>">
    <link href="css/login.css" type="text/css" rel="stylesheet">
    <script src="jquery/jquery-3.6.0.js"></script>
    <script type="text/javascript" src="js/login.js"></script>
    <script type="text/javascript">
        window.onload=function () {
            //验证码单击切换
            var codeImg = document.getElementById("codeImg");
            codeImg.onclick=function () {
                codeImg.src = "${basePath}kaptcha.jpg?id=" + new Date();
            }
        }
    </script>
</head>
<body>
<div class="header"><!--页面顶部栏-->
    <img src="static/img/login/logo.png" alt="编组">
</div>
<div class="background1">
<div class="cont">
    <p class="class1">登录</p>
    <div id="hint" class="hint"><img src="static/img/login/bulb.png" class="bulb">${empty requestScope.msg ? "请输入账号和密码":requestScope.msg}</div>
    <form action="userServlet?action=login" method="post">
        <p><label>账号：</label><input value="${requestScope.username}" type="text" required="required" placeholder="邮箱/手机号码/小米ID" onblur="checkName();" id="username" name="username"></p>
        <div id="info_name" class="info_area"></div>
        <p><label>密码：</label><input value="${requestScope.password}" type="password" required="required" placeholder="密码" onblur="checkPassword();" id="password" name="password"></p>
        <div id="info_password" class="info_area"></div>
        <p>
            <label>验证码：</label><input  type="text" required="required" placeholder="请输入验证码" onblur="checkCode();" id="code" name="code">
        <img id="codeImg" src="kaptcha.jpg" class="kaptcha"><!--验证码-->
        <div id="info_code" class="info_area"></div>
        </p>
        <p><input type="checkbox" class="checkbox" onclick="Get(this)"><span class="fc">已阅读并同意Shoppe账号</span><a  target="_blank" href="https://static.account.xiaomi.com/html/agreement/user/zh_CN.html" class="link1">用户协议</a><span class="fc">和</span><a href="https://privacy.mi.com/miaccount/zh_CN/" class="link1">隐私政策</a>
        </p>
        <p>
            <button type="submit" onclick="checkAll()" id="button1">登录</button>
            <a id="register" href="register.jsp"> 快速注册</a>
        </p>

    </form>
</div>
</div>
<div class="bottom">Shoppe公司版权所有-京ICP备10046444-京公网安备11010802020134号-京ICP证110507号</div>
</body>
</html>